<template>
  <div>
    <tab-bar>
      <tab-bar-item path="/home" activeColor="pink">
        <img slot="item-icon" src="@/assets/img/Tabber/home.png"alt="">
        <img slot="item-active-icon" src="@/assets/img/Tabber/home-active.png" alt="">
        <div slot="item-text">首页</div>
      </tab-bar-item>
      <tab-bar-item path="/channel" activeColor="pink">
        <img slot="item-icon" src="@/assets/img/Tabber/channel.png"alt="">
        <img slot="item-active-icon" src="@/assets/img/Tabber/channel-active.png" alt="">
        <div slot="item-text">频道</div>
      </tab-bar-item>
      <tab-bar-item path="/dynamic" activeColor="pink">
        <img slot="item-icon" src="@/assets/img/Tabber/dynamic.png"alt="">
        <img slot="item-active-icon" src="@/assets/img/Tabber/dynamic-active.png" alt="">
        <div slot="item-text">动态</div>
      </tab-bar-item>
      <tab-bar-item path="/profile" activeColor="pink">
        <img slot="item-icon" src="@/assets/img/Tabber/profile.png"alt="">
        <img slot="item-active-icon" src="@/assets/img/Tabber/profile-active.png" alt="">
        <div slot="item-text">我的</div>
      </tab-bar-item>
    </tab-bar>
  </div>
</template>

<script>
  import tabBarItem from "@/components/common/tabbar/Tab-bar-Item"
  import tabBar from "@/components/common/tabbar/Tab-bar"
    export default {
        name: "miniTabBar",
      components:{
          tabBarItem,tabBar
      },
    }
</script>

<style scoped>

</style>
